import React from 'react';
import { Button, Input, Form, message, InputNumber, DatePicker, Checkbox, Space } from 'antd';
import request from '@/utils/request';
import CateComp from '@/components/CategoryComponent';
import PartSelect from '@/components/PartSelect';
import { DeptSelect, EmpSelect } from '@/components/FormItemSelect';
import moment from 'moment';

const apiURL = '/api/services/app/Demands/';
class DemandEntry extends React.Component<any, any> {
  constructor(props: any) {
    super(props);
    this.state = {
      loading: false,
      dataSource: [],
    };
  }
  formRef: any = React.createRef();
  componentDidMount() {
    this.props.onRef(this)
  }
  onFinish = (values: any) => {
    const { act } = this.state
    var model = values.model;
    this.setState({ loading: true });
    model.reqDate = model.reqDate.format('YYYY-MM-DD')
    request(apiURL + act, {
      method: 'POST',
      data: model,
    }).then((response) => {
      if (response) {
        if (response.success) {
          message.success('保存成功！');
          this.props.fetchData();
        }
        this.setState({ loading: false });
      }
    });
  };
  fetchDatas = (id: number) => {
    if (id > 0) {
      request(apiURL + 'Get', {
        method: 'GET',
        params: { Id: id },
      }).then((response) => {
        var model = response?.result;
        if (model.reqDate)
          model.reqDate = moment(model.reqDate);
        this.formRef.current.setFieldsValue({ model });
        this.setState({ act: 'Modify' })
      });
    }
  };
  setCurrentPart = (part?: any) => {
    if (part) {
      var model: any = {};
      model.partNum = part.partNum;
      model.partDescription = part.partDescription;
      model.ium = part.ium;
      this.formRef.current.setFieldsValue({ model });
    }
  }
  resetForm = () => {
    this.setState({ act: 'New' })
    this.formRef.current.resetFields();
  }
  render() {
    const layout = {
      labelCol: { span: 5 },
      wrapperCol: { span: 19 },
    };
    return (
      <Form {...layout} ref={this.formRef} onFinish={this.onFinish}>
        <Form.Item name={['model', 'id']} label="需求号">
          <Input disabled style={{ width: 200 }} />
        </Form.Item>
        <Form.Item label="物料编码">
          <PartSelect
            name={['model', 'partNum']}
            noStyle
            width={150}
            required={true}
            placeholder="物料编码"
            setCurrent={this.setCurrentPart}
          />
        </Form.Item>
        <Form.Item name={['model', 'partDescription']} label="物料描述" rules={[{ required: true }]}>
          <Input disabled />
        </Form.Item>
        <Form.Item label="需求数量">
          <Input.Group compact>
            <Form.Item noStyle name={['model', 'reqQty']} rules={[{ required: true }]}>
              <InputNumber />
            </Form.Item>
            <Form.Item noStyle name={['model', 'ium']}>
              <Input style={{ width: 80 }} placeholder="单位" disabled />
            </Form.Item>
          </Input.Group>
        </Form.Item>
        <Form.Item
          name={['model', 'reqDate']}
          label="需求日期"
          rules={[{ required: true, message: '请选择需求日期' }]}
        >
          <DatePicker />
        </Form.Item>
        <DeptSelect
          width={200}
          required
          name={['model', 'department']}
          placeholder="请选择部门"
          label="需求部门" />
        <EmpSelect
          required={true}
          width={200}
          name={['model', 'reqUser']}
          label="需求人员"
        />
        <Form.Item name={['model', 'commentText']} label="备注">
          <Input.TextArea />
        </Form.Item>
        <CateComp
          layout="需求类型"
          width={200}
          name={['model', 'reqType']}
          label="需求类型"
          required
        />
        <Form.Item wrapperCol={{ offset: 5 }}>
          <Input.Group compact>
            <Form.Item name={['model', 'approve']} valuePropName="checked">
              <Checkbox disabled>核准</Checkbox>
            </Form.Item>
            <Form.Item name={['model', 'openLine']} valuePropName="checked">
              <Checkbox disabled>未结</Checkbox>
            </Form.Item>
          </Input.Group>
        </Form.Item>
        <Form.Item wrapperCol={{ ...layout.wrapperCol, offset: 5 }}>
          <Space>
            <Button type="primary" htmlType="submit">
              保存
            </Button>
            <Button type="default" danger onClick={() => this.resetForm()}>
              重设
            </Button>
          </Space>
        </Form.Item>
      </Form>
    );
  }
}
export default DemandEntry;
